<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>

    <style>
            .main{
                    width: 400px;
                    height: 600px;
                    background: red;
                    display: flex;
                    flex-direction: column;
            }

            .header{
                    height: 60px;
                    background: green;

            }

            .content{
                    background: pink;
                    flex: 1;
                    display: flex;
            }
            .footer{
                  height: 60px;
                  background: blue;
            }

            .article{
                    width: 100px;
                    background: red;
            }

            .aside{
                    flex: 1;
                    background: #0EA9B1;
            }
    </style>


</head>
<body>

        <div class="main">
                <div class="header"></div>
                <div class="content">
                        <div class="article"></div>
                        <div class="aside"></div>
                </div>
                <div class="footer"></div>
        </div>

</body>
</html>